{% extends 'base.html' %}

{% block title %}许可管理{% endblock %}

{% block body %}
    <table class="layui-hide" id="table" lay-filter="table"></table>
    <a href="{% url 'auth:permission_create' %}" class="layui-btn layui-btn-normal">创建许可</a>
{% endblock %}

{% block js %}
    <script type="text/html" id="barManager">
        <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
    <script>
        layui.use(['form', 'jquery', 'table', 'layer'], function () {
            var form = layui.form,
                $ = layui.jquery,
                layer = layui.layer,
                table = layui.table;

            table.render({
                elem: '#table'
                , url: '{% url "auth:permission_api" %}'
                , cols: [[
                    {field: 'id', title: 'ID', sort: true, width: 60}
                    , {field: 'name', title: '名称', width: 120}
                    , {field: 'url_name', title: 'url'}
                    , {field: 'method', title: 'method'}
                    , {field: 'is_menu', title: '是否为菜单', width: 100}
                    , {field: 'created_at', title: '创建时间'}
                    , {field: 'update_at', title: '更新时间'}
                    , {field: 'parent', title: '父级菜单ID', width: 100}
                    , {fixed: 'right', title: '操作', width: 120, minWidth: 120, toolbar: '#barManager'}
                ]],
                page: true, // 是否显示分页
                limits: [10, 20],
                limit: 10,
                error: function (error){
                    if (error.status === 403){
                        layer.msg('接口无权限，请联系管理员', {icon: 5})
                    }
                }
            })

            //监听行工具事件
            table.on('tool(table)', function (obj) {
                var data = obj.data;
                if (obj.event === 'del') {
                    layer.confirm('确定要删除' + data["name"]  + ' 这个角色吗？', function (index) {
                        const csrf_token = $('[name="csrfmiddlewaretoken"]').val();
                        data['dp_name'] = '{{ dp_name }}';
                        console.log(data)
                        $.ajax({
                            url: '{% url "auth:permission_api" %}',
                            type: "DELETE",
                            data: data,
                            headers: {"X-CSRFToken": csrf_token},
                            success: function (res) {
                                if (res.code === 0) {
                                    obj.del();
                                    layer.msg(res.msg, {icon: 6});
                                } else {
                                    layer.msg(res.msg, {icon: 5})
                                }
                            }, error: function (error){
                                layer.msg(error, {icon: 5})
                            }
                        });
                    })
                } else if (obj.event === 'edit') {
                    const id = data['id']
                    window.location.href = '{% url "auth:permission_edit" %}?ID=' + id
                }
            });
        })
    </script>
{% endblock %}